import Vue from "vue";
import VueRouter from "vue-router";
import HomePage from "../views/HomePage.vue";

Vue.use(VueRouter);
// 双击同一路由时出错的问题解决
// prototype--原型对象，原型对象中存储的属性或方法只会初始化一次但是可以被所有相关的类产生对象访问，该操作可以有效节省系统内存
const routerPush = VueRouter.prototype.push;
const routerPlace = VueRouter.prototype.replace;
// 分别重写VueRouter内部的push和replace方法
VueRouter.prototype.push = function push (location) {
  // 将系统原来的push方法重新交给当前VueRouter对象来执行，同时捕获执行过程中对应的异常
  /*
      fun.call(obj,param1,param2,...)
      fun.apply(obj, [param1,param2,...]);
      call,apply被称为方法的方法，作用是将方法fun的调用权限绑定给对象obj，如果fun调用过程中需要传递参数，此时可以将obj后边的参数一次赋值给对应的形参。
      call，apply--作用是强制改变fun方法中this的指向
  */
  return routerPush.call(this, location).catch(error => error);
};
VueRouter.prototype.replace = function push (location) {
  return routerPlace.call(this, location).catch(error => error);
};

const routes = [
  {
    path: "/",
    name: "Home",
    component: HomePage,
    // 用来设置路由的额外参数。对动画到一个解释说明的作用
    meta: {
      index: 1,
      kind: "deep1"
    }
  },
  {
    path: "/homeshop",
    name: "HomeShop",
    component: () => import("../components/HomeShop.vue")
  },
  {
    path: "/find",
    name: "Find",
    component: () => import("../views/FindPage.vue"),
    meta: {
      index: 1,
      kind: "deep2"
    }
  },
  {
    path: "/order",
    name: "Order",
    component: () => import("../views/OrderPage.vue"),
    meta: {
      index: 1,
      kind: "deep3"
    }
  },
  {
    path: "/mine",
    name: "Mine",
    component: () => import("../views/MinePage.vue"),
    meta: {
      index: 1,
      kind: "deep4"
    }
  },
  {
    path: "/Shoper",
    name: "Shoper",
    component: () => import("../views/ShoperPage.vue"),
    meta: {
      index: 2,
      kind: "deep1"
    }
  }
];

const router = new VueRouter({
  mode: "history",
  base: process.env.BASE_URL,
  routes
});

export default router;
